<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Title</title>
  </head>
  
  <body>
    <div id="app">
      <div v-text="text"></div>
      
      <!-- v-text将当前元素的innerText设置为指定值 -->
      <div v-text="text" style="font-size: 40px"></div>
      
      <!-- 标签中原来的内容被覆盖 -->
      <div v-text="text">
        <span style="color: blue">blue</span>
      </div>
    </div>
  </body>
  
  <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
  
  <script>
    Vue.createApp({
      data() {
        return {
          // 试着修改以下属性值，看看HTML中的变化
          text: '<span style="color: red">red</span>',
        };
      }
    }).mount('#app');
  </script>
</html>